import './App.scss'
import { Router, Route, Switch, Redirect } from 'react-router-dom'
// 导入页面
import Layout from '@/pages/layout'
import Login from '@/pages/login'
import NotFound from '@/pages/404'
import Test from './pages/test'
import AuthRoute from './components/auth'

// 导入自定义history对象
import customHistory from '@/utils/history'
//路由配置
function App() {
  return (
    <Router history={customHistory}>
      <div className="app">
        {/* 路由规则path对应的组件渲染到配置路由的位置 */}
        {/* <div className="box">
        <h1>scss使用</h1>
      </div> */}
        {/* 配置路由规则：根组件配置的一级路由 */}
        <Switch>
          {/* path地址是/,重定向到/home */}
          <Redirect exact from="/" to="/home" />
          {/* <Route path="/home" component={Layout} /> */}
          {/* 
          AuthRoute封装说明：
          1. 可以配置路由
          2. 内部会有拦截（是否有token）
           */}
          <AuthRoute path="/home" component={Layout} abc="1" />
          <Route path="/test" component={Test} />

          <Route path="/login" component={Login} />
          {/* 兜底：404 */}
          <Route component={NotFound} />
        </Switch>
      </div>
    </Router>
  )
}

export default App
